<template>
    <div id="setting">
      <el-form label-position="left" label-width="40%" :model="formData" :rules="rules" ref="ruleForm">
        <el-form-item label="服务端口(默认值:8008)"  prop="servePort">
          <el-input v-model="formData.servePort" maxlength="5" clearable placeholder="请输入0-65535之间的数字"> </el-input>
        </el-form-item>
        <el-form-item label="服务日志记录等级">
          <el-select v-model="formData.logLevel" placeholder="请选择密钥类型">
            <el-option
              v-for="item in rankList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="开机自动启动">
          <el-select v-model="formData.updateSelfStart" placeholder="请选择是否开机自动启动">
            <el-option
              v-for="item in autoStartList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="会话超时时间(分钟)(0-65535)" prop="timeOut">
          <el-input v-model="formData.timeOut" maxlength="5" clearable placeholder="请输入0-65535之间的数字"> </el-input>
        </el-form-item>
        <el-form-item label="最大并发数(0-65535)" prop="maxConcurrency">
          <el-input v-model="formData.maxConcurrency" maxlength="5" clearable placeholder="请输入0-65535之间的数字"> </el-input>
        </el-form-item>
        <el-form-item label="服务连接密码" prop="connectPwd">
          <el-input  v-model="formData.connectPwd" show-password clearable maxlength="8" placeholder="请输入8位纯数字"> </el-input>
        </el-form-item>
        <el-form-item label="服务启动口令(操作员口令)" prop="startPwd">
          <el-input  v-model="formData.startPwd" show-password clearable  maxlength="8" placeholder="请输入8位纯数字"> </el-input>
        </el-form-item>
        <el-form-item label="是否支持syslog发送日志">
          <el-select v-model="formData.sendLog"  >
            <el-option
              v-for="item in sendLogList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <el-button type="primary" id="step4" @click="dealWith('ruleForm')" v-show="page==='step'">下一步</el-button>
      <el-button type="primary" id="save" @click="dealWith('ruleForm')"  v-show="page==='set'">保 存</el-button>
    </div>
</template>

<script>
  import request from '../utils/request';
  export default {
    name: "serveSetting",
    props:["page"],
    data(){
      var validateServePort = (rule, value, callback) => {
        this.checkServeSettingCommon(value,callback)
      };
      var validateTimeOut = (rule, value, callback) => {
        this.checkServeSettingCommon(value,callback)
      };
      var checkMaxConcurrency = (rule, value, callback) => {
        this.checkServeSettingCommon(value,callback)
      };
      var checkMaxConnectPwd = (rule, value, callback) => {
        this.checkICPassCommon(value,callback)
      };
      var checkMaxStartPwd = (rule, value, callback) => {
        this.checkICPassCommon(value,callback)
      };
      return{
        rankList:[
          {
            value:1,
            label:"不记录"
          },
          {
            value:2,
            label:"致命错误"
          },
          {
            value:3,
            label:"一般错误"
          },
          {
            value:4,
            label:"警告错误"
          },
          {
            value:5,
            label:"重要变量"
          },
          {
            value:6,
            label:"调试信息"
          },
          {
            value:7,
            label:"跟踪信息"
          }
        ],
        autoStartList:[
          {
            value:0,
            label:"不启动"
          },
          {
            value:1,
            label:"自动启动"
          }
        ],
        sendLogList:[
          {
            value:0,
            label:"不支持"
          },
          {
            value:1,
            label:"支持"
          }
        ],
        formData:{
          servePort:"8088",
          logLevel:0,
          updateSelfStart:0,
          timeOut:"",
          maxConcurrency:"",
          connectPwd:"",
          startPwd:"",
          sendLog:0
        },
        rules: {
          servePort: [
            { validator: validateServePort, trigger: 'blur' }
          ],
          timeOut: [
            { validator: validateTimeOut, trigger: 'blur' }
          ],
          maxConcurrency: [
            { validator: checkMaxConcurrency, trigger: 'blur' }
          ],
          connectPwd: [
            { validator: checkMaxConnectPwd, trigger: 'blur' }
          ],
          startPwd: [
            { validator: checkMaxStartPwd, trigger: 'blur' }
          ]
        }
      }
    },
    methods:{
      //验证0-65535数字
      checkServeSettingCommon(value,callback){
        let reg=/^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/;
        if (!value) {
          return callback(new Error('内容不能为空'));
        }else if(!reg.test(value)){
          return callback(new Error('请输入0到65535之间的数字'));
        }else{
          callback();
        }
      },
      //验证8为纯数字
      checkICPassCommon(value,callback){
        if (!value) {
          return callback(new Error('内容不能为空'));
        }else if(value.length !==8){
          return callback(new Error('内容长度必须是8位'));
        }else if( !/^\d{8}$/.test(value)) {
          return callback(new Error('内容必须是8位纯数字'));
        }else{
          callback();
        }
      },
      inquiryList(){
        let that=this;
        request({
          method: 'get',
          url: 'severInfo/getConfigInfo'
        }).then(function (res) {
          if(res.code===200){
            let {servePort,logLevel,updateSelfStart,timeOut,maxConcurrency,connectPwd,startPwd,sendLog,serveId}=res.result;
            that.formData={servePort,logLevel,updateSelfStart,timeOut,maxConcurrency,connectPwd,startPwd,sendLog,serveId};
          }
        }).catch(function (error) {
          console.log(error);
        });
      },
      dealWith(formName){
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.$emit('dealWith',this.formData)
          } else {
            return false;
          }
        });
      }
    }
  }
</script>

<style scoped>
    #setting .el-form{
      padding-left:20%;
      width:100%;
      box-sizing: border-box;
      margin: 0 auto;
    }
    #setting .el-form .el-form-item{
      margin-bottom:15px;
    }
    #setting .el-form .el-input , #setting .el-form .el-select{
      width:60%;
      min-width:300px;
    }
    #setting .el-form >>>.el-input__inner{
      height:30px;
      line-height: 30px;
    }
    #setting #step4{
      position: absolute;
      bottom:2%;
      right:10%;
    }
    #setting #save{
      position: absolute;
      bottom:2%;
      left:46%;
    }
</style>
